<template>
  <div>
      <h1>toRefs</h1>
      <p>name: <input v-model="name"> {{name}}</p>
      <p>age:{{age}}</p>
  </div>
</template>

<script>

import {reactive,toRefs} from "vue";


export default {
    setup() {
        // 
        let people = reactive({name: "Hydra",age:35});

        // toRefs把一个响应式对象转为一个普通对象，该普通对象的所有属性，都是指向源响应式对象的所有响应式属性。
        // let people2 = toRefs(people);
        // let name = people2.name;
        // let age = people2.age;

        // 通常是解构使用
        let {name,age} = toRefs(people);
        return {name,age}
    }
}
</script>

<style>

</style>